<template>
    <view class="container">
        <div class="border">
            <div class="border-content">
                <!-- 表单 -->
                <!-- <div style="color: #718778;">
                    <div style="color:#1A512C;font-weight: 600;font-size: 17px;">出发时称车重</div>
                    <div style="height: 10px;"></div>
                    <div class="form-flex">
                        <div style="width: 25%;color: #1A512C;font-weight: 500;">车牌号</div>
                        <div class="borders">
                            <div style="height: 5rpx;"></div>
                            <input type="text" v-model="car1" placeholder="请输入车牌号">
                            <div style="height: 5rpx;"></div>

                        </div>
                    </div>
                    <div style="height: 10px;"></div>
                    <div class="form-flex">
                        <div style="width: 25%;color: #1A512C;font-weight: 500;">重量(t)</div>
                        <div class="borders">
                            <div style="height: 5rpx;"></div>
                            <input type="text" v-model="weight1" placeholder="请输入进厂重量">
                            <div style="height: 5rpx;"></div>
                        </div>
                    </div>
                    <div style="height: 10px;"></div>
                </div>
                <div style="height: 10px;"></div>
                <div class="footer">
                    <div class="button-footer" @click="cancel">取消</div>
                    <div class="button-footer" @click="save">提交</div>
                </div>
                <div style="height: 30px;"></div>
                <div style="color: #718778;">
                    <div style="color:#1A512C;font-weight: 600;font-size: 17px;">返回时称车重</div>
                    <div style="height: 10px;"></div>
                    <div class="form-flex">
                        <div style="width: 25%;color: #1A512C;font-weight: 500;">车牌号</div>
                        <div class="borders">
                            <div style="height: 5rpx;"></div>
                            <input type="text" v-model="car" placeholder="请输入车牌号">
                            <div style="height: 5rpx;"></div>

                        </div>
                    </div>
                    <div style="height: 10px;"></div>
                    <div class="form-flex">
                        <div style="width: 25%;color: #1A512C;font-weight: 500;">重量(t)</div>
                        <div class="borders">
                            <div style="height: 5rpx;"></div>
                            <input type="text" v-model="weight" placeholder="请输入进厂重量">
                            <div style="height: 5rpx;"></div>
                        </div>
                    </div>
                    <div style="height: 10px;"></div>
                </div>
                <div style="height: 10px;"></div>
                <div class="footer">
                    <div class="button-footer" @click="cancel">取消</div>
                    <div class="button-footer" @click="saves">提交</div>
                </div> -->
            </div>
            <div style="height: 20px;"></div>
            <div class="card">
                <div style="width: 90%;margin-left: 5%;">
                    <div style="height: 10px;"></div>
                    <div style="font-size: 18px;font-weight: 500;">出发时车重</div>
                    <div style="height: 10px;"></div>
                    <u-line color="#f1f1f1"></u-line>
                    <div style="height: 10px;"></div>
                    <div>
                        <div>车牌号</div>
                        <div style="height: 15rpx;"></div>
                        <div class="borders">
                            <input style="height: 42px;" v-model="car1" placeholder="请输入车牌号" type="text">
                        </div>
                    </div>
                    <div style="height: 10px;"></div>
                    <div>
                        <div>重量（t）</div>
                        <div style="height: 15rpx;"></div>
                        <div class="borders">
                            <input v-model="weight1" style="height: 42px;" placeholder="请选择时间" type="text">
                        </div>
                    </div>
                    <div style="height: 20px;"></div>
                    <div class="saveClass" @click="save">确认提交</div>
                    <div style="height: 20px;"></div>
                </div>
            </div>
            <div style="height: 20px;"></div>
            <div class="card">
                <div style="width: 90%;margin-left: 5%;">
                    <div style="height: 10px;"></div>
                    <div style="font-size: 18px;font-weight: 500;">返回时车重</div>
                    <div style="height: 10px;"></div>
                    <u-line color="#f1f1f1"></u-line>
                    <div style="height: 10px;"></div>
                    <div>
                        <div>车牌号</div>
                        <div style="height: 15rpx;"></div>
                        <div class="borders">
                            <input style="height: 42px;" v-model="car" placeholder="请输入车牌号" type="text">
                        </div>
                    </div>
                    <div style="height: 10px;"></div>
                    <div>
                        <div>重量（t）</div>
                        <div style="height: 15rpx;"></div>
                        <div class="borders">
                            <input v-model="weight" style="height: 42px;" placeholder="请选择时间" type="text">
                        </div>
                    </div>
                    <div style="height: 20px;"></div>
                    <div class="saveClass" @click="saves">确认提交</div>
                    <div style="height: 20px;"></div>
                </div>
            </div>
        </div>
    </view>
</template>
<script>
import { addWagons, outWeighBridge } from '../api/api';
export default {
    data() {

        return {
            weight: '',
            weight1: '',
            car: '',
            car1: '',
        }
    },
    methods: {
        clear() {
            this.car = '';
            this.weight = '';
        },
        // 返回
        cancel() {
            uni.navigateBack({ delta: 1 })
        },
        saves() {
            if (!this.car || !this.weight) {
                uni.showToast({
                    title: '输入完整后提交',
                    icon: 'none'
                })
            } else {
                addWagons({
                    licenseNumber: this.car,
                    enterWeight: this.weight,
                }).then(res => {
                    console.log(res.data, 'res');
                    if (res.data.code == 200) {
                        uni.showToast({
                            title: res.data.msg,
                            icon: 'success'
                        })
                        this.clear();
                        setTimeout(() => {
                            this.cancel();
                        }, 1000)
                    }
                })
            }
        },
        save() {
            if (!this.car1 || !this.weight1) {
                uni.showToast({
                    title: '输入完整后提交',
                    icon: 'none'
                })
            } else {
                outWeighBridge({
                    licenseNumber: this.car1,
                    leaveWeight: this.weight1,
                }).then(res => {
                    console.log(res.data, 'res');
                    if (res.data.code == 200) {
                        uni.showToast({
                            title: res.data.msg,
                            icon: 'success'
                        })
                        this.clear();
                        setTimeout(() => {
                            this.cancel();
                        }, 1000)
                    } else {
                        uni.showToast({
                            title: res.data.msg,
                            icon: 'none'
                        })
                    }
                })
            }
        }





    },


}
</script>
<style lang="scss">
.saveClass{
    width: 100%;
    height: 45px;
    background: #000000;
    color: #ffffff;
    border-radius: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.container {
    .border {
        background: #f3f3f3;
        height: 100vh;
        overflow-y: scroll;
        .border-content {
            width: 90%;
            margin-left: 5%;
        }
    }
}

.top-line {
    display: flex;
    align-items: center;
}
.card {
    padding: 10;
    background: #ffffff;
    border-radius: 7px;
    width: 90%;
    margin-left: 5%;
}
.line {
    background: #1A512C;
    width: 7rpx;
    height: 35rpx;
}

.form-flex {
    display: flex;
    align-items: center;
    width: 100%;
}

.borders {
    border: 1px solid #000000;
    border-radius: 5px;
    text-align: center;
}

.borders-min {
    border: 1px solid #1A512C;
    border-radius: 5px;
    text-align: center;
}

.footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.button-footer {
    width: 48%;
    height: 50px;
    background: #46A164;
    color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 18px;
    font-weight: 500;
    border-radius: 10px;
}
</style>